<template>
    <div class="comment">
        <div class="comm-hd">
            <h1>发表评论</h1>
            <textarea name="comm" placeholder="请输入想说的话（最多120字）" maxlength="120"></textarea>
            <mt-button type="primary" size="large">发表</mt-button>
        </div>
        <div class="comm-bd">
            <div class="comm-cell">
                <div class="info">
                    <span>第1楼</span>
                    <span>用户：匿名</span>
                    <span>发表时间：2019-03-07 17:51:30</span>
                </div>
                <div class="detail">
                    <p>美好生活都是奋斗出来的</p>
                </div>
            </div>
            <div class="comm-cell">
                <div class="info">
                    <span>第2楼</span>
                    <span>用户：匿名</span>
                    <span>发表时间：2019-03-07 17:51:30</span>
                </div>
                <div class="detail">
                    <p>我们都是追梦人</p>
                </div>
            </div>
            <div class="comm-cell">
                <div class="info">
                    <span>第3楼</span>
                    <span>用户：匿名</span>
                    <span>发表时间：2019-03-07 17:51:30</span>
                </div>
                <div class="detail">
                    <p>撸起袖子加油干</p>
                </div>
            </div>
        </div>
        <mt-button type="danger" size="large" plain>加载更多</mt-button>
    </div>
</template>

<script>
export default {
    data(){
        return {
            message: ''
        }
    },
    methods : {

    },
    props:["id"]
}
</script>

style <style lang="scss" scoped>

$baseColor:#26a2ff;
    .comment{
        padding: 5px 15px 0px;
        .comm-hd{
            h1 {
                font-size: 20px;
                font-weight: 400;
                padding-bottom: 5px;
                padding-left: 5px;
                color: $baseColor;
            }
            textarea {
                margin-bottom: 0;
                width: 100%;
                height: 140px;
            }
        }
        .comm-bd{
            padding-top: 10px;
            .comm-cell {
                background: #fff;
                .info{
                    font-size: 12px;
                    color: #8f8f94;
                    margin-bottom: 5px;
                    span {
                        padding-right: 5px; 
                    }
                }
                .detail{
                    p {
                        font-size: 14px;
                        color: #000;
                    }
                }

            }
            
        }
    }
</style>
